<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <style type="text/css">
        html
        {
            overflow-x: hidden;
            overflow-y: auto;
        }
        body
        {
            font-family: "Microsoft YaHei", Georgia, Helvetica, Arial, sans-serif, 宋体, serif, PMingLiU;
            color: black;
            background-color: #fff;
            font-size: 9pt;
            margin: 1em;
            line-height: 1.5;
            margin-top:0;
        }
        .button {
            width: 70px;
            font-family: "Microsoft YaHei", Georgia, Helvetica, Arial, sans-serif, 宋体, serif, PMingLiU;
        }
    </style>
    <script type="text/javascript" charset="utf-8" src="google-code-prettify/prettify.js" ></script>
    <link  rel="stylesheet" type="text/css" href="wiz_code_highlight.css" />
</head>
<body>
        <table style="width: 100%;">
            <tr>
                <td>
                <div>
                    <span style="vertical-align:middle" id="labelLanguage">Wiz_Language_Replace:</span>&nbsp;
                    <select id="selectLanguage" style="width:200px; vertical-align:middle" onchange="return selectLanguage_onchange();">
                        <option value="c">C</option>
                        <option value="cpp">C++</option>
                        <option value="cs">C#</option>
                        <option value="java">Java</option>
                        <option value="html">HTML</option>
                        <option value="js">JavaScript</option>
                        <option value="perl">Perl</option>
                        <option value="py">Python</option>
                        <option value="rb">Ruby</option>
                        <option value="sh">Shell</option>
                        <option value="xml">Xml</option>
                        <option value="xsl">XSL</option>
                        <option value="css">CSS</option>
                        <option value="basic">Basic</option>
                        <option value="apollo">Apollo</option>
                        <option value="erlang">Erlang</option>
                        <option value="go">Go</option>
                        <option value="lua">Lua</option>
                        <option value="matlab">Matlab</option>
                        <option value="pascal">Pascal</option>
                        <option value="sql">SQL</option>
                        <option value="vb">Visual Basic</option>
                        <option value="yaml">YAML</option>
                        <option value="php">PHP</option>
                    </select>
                </div>
                </td>
            </tr>
            <tr>
                <td>
                    <textarea id="textSource" style="width:100%;height:150px" cols="10" rows="10" onkeyup="return textSource_onkeyup()" onpaste="return textSource_onpaste()"></textarea>
                </td>
            </tr>
            <tr>
                <td>
                    <div style="text-align:right;">
                        <span id="promptDelay" style="float: left;color: #f47b49;visibility: hidden;"></span>
                        <input id="buttonOK" class="button" onclick="return buttonOk_onclick()" type="button" value="Wiz_OK_Replace" />
                        <input id="buttonCancel" class="button" onclick="return buttonCancel_onclick()" type="button" value="Wiz_Cancel_Replace" /></div>
                </td>
            </tr>
        </table>
        <div id="divResult"></div>
    <script language="javascript">

        function initForWebEngine()
        {
            window.objApp = codeEditor;
            //
            (function init() {
                textSource.focus();
                //
                var text = getSelectText();
                if (text) {
                    textSource.value = text;
                    highlightCode();
                }
                //
                initLanguage();
                //
            })();
        }

        //
        function highlightCode() {
            var source = textSource.value;
            source = source.replace(/\</gi, "&lt;");
            source = source.replace(/\>/gi, "&gt;");
            //
            var lang = selectLanguage.value;
            //
            
            //
            divResult.innerHTML = "<div><pre class=\"prettyprint linenums\"><code class=\"language-" + lang + "\">" + source + "</code></pre></div>" + "<div></br></div>";
            prettyPrint();
        }
        //
        function getCodeNumber() {
            try {
                var print = document.querySelector('#divResult .prettyprint');
                if (!print)
                    return 0;

                var ol = print.firstChild;
                if (!ol)
                    return 0;
                return ol.childElementCount;
            }
            catch(e) {

            }

            return 0;
        }
        //
        function promptDelayRender() {
            var text = promptDelay.textContent;
            text = text.replace("%1", 150).replace("%2", 1);
            
            promptDelay.textContent = text;
            promptDelay.style.visibility = "visible";
        }
        //
        var keyupTimer;
        function textSource_onkeyup() {
            var num = getCodeNumber();
            if (num < 150) {
                highlightCode();
            }
            else {
                promptDelayRender();

                clearTimeout(keyupTimer);
                keyupTimer = setTimeout(timeProc, 500);
            
                function timeProc() {
                    highlightCode();
                    clearTimeout(keyupTimer);
                }
            }
        }
        var preValue;
        var pasteTimer;
        function textSource_onpaste() {
            function _proc() {
                clearTimeout(pasteTimer);
                if (preValue != textSource.value) {
                    highlightCode();
                }
            }

            preValue = textSource.value;
            clearTimeout(pasteTimer);
            pasteTimer = setTimeout(_proc, 100);

        }
        //
        function selectLanguage_onchange() {
            highlightCode();
        }
        //
        function buttonCancel_onclick() {
            try {
                //external.ClosePluginDlg(document, 0);
                objApp.close();
            }
            catch(e) {

            }
        }
        function GetPluginPath() {
            var path = document.URL;
            path = path.replace(/\/[^\/]*$/ig, "\/");
            //
            return path;
        }
        //
        function insertCss(doc) {
            
            if (!doc)
                return;
            if (!external)
                return;
            //
            var oldLink = doc.getElementById('wiz_code_highlight_link');
            if (oldLink) {
                oldLink.parentNode.removeChild(oldLink);
            }
            //
            var link = doc.createElement('link');
            if (!link)
                return;
            try {
                link.type = 'text/css';
                link.rel = 'stylesheet';
                link.id = 'wiz_code_highlight_link';
                link.href = GetPluginPath() + "wiz_code_highlight.css";
                //
                if (!doc.head)
                {
                    doc.insertBefore(doc.createElement('head'), doc.body);
                }
                doc.head.appendChild(link);
            }
            catch(e) {

            }
        }
        //
        function buttonOk_onclick() {
            prettyPrint();

            try {
                //var doc = external.editorDocument;
                //insertCss(doc);
                //    
                var code = divResult.innerHTML;
                // doc.execCommand("insertHTML", false, code);
                objApp.insertHtml(code);
                //
                setLaunguage(selectLanguage.value);
                //
                objApp.close();
            }
            catch(e) {

            }
        }
        //
        function getSelectText() {
            try {
                var doc = external.editorDocument;
                var sel = doc.getSelection();
                if (!sel || sel.rangeCount < 1)
                    return "";
                var rng = sel.getRangeAt(0);
                var frag = rng.cloneContents();
                var childNodes = frag.childNodes;
                if (!childNodes || childNodes.length < 1)
                    return "";

                var node = doc.createElement('div');
                node.style.position = "absolute";
                node.style.left = "-10000px";
                doc.body.appendChild(node);            
                while (childNodes.length > 0) {
                    node.appendChild(childNodes[0]);
                }

                var text = node.innerText;
                doc.body.removeChild(node);
                return text;
            }
            catch(e) {

            }

            return "";
        }
        //
        function getLanguage() {
            if (!objApp)
                return "";
            return objApp.getLastCodeType();
            
        } 
        function setLaunguage(lang) {
            if (!objApp)
                return;
            objApp.saveLastCodeType(lang);
        }
        function initLanguage() {
            var lang = getLanguage();
            if (!lang)
                return;
            var options = selectLanguage.options;
            for (var i = 0; i < options.length; i ++) {
                var option = options[i];
                if (option.value.toLowerCase() === lang.toLowerCase()) {
                    selectLanguage.selectedIndex = i;
                }
            }
        }


    </script>

</body>
</html>
